<!--  -->
<template>
  <div class="submitBox">
    <!-- 报备信息 -->
    <ul class="personInfo">
      <li>
        <div class="item">
          <p class="tip">报备人姓名：</p>
          <p>{{reportState.form.registrarName}}</p>
        </div>
        <div class="item">
          <p class="tip">项目名称：</p>
          <p>{{reportState.form.bidPlatformName}}</p>
        </div>
      </li>
      <li>
        <div class="item">
          <p class="tip">报备人电话：</p>
          <p>{{reportState.form.registrarPhone}}</p>
        </div>

        <div class="item">
          <p class="tip">竞价截止时间：</p>
          <p>{{reportState.form.bidEndTime | dateFilter}}</p>
        </div>
      </li>
      <li>
        <div class="item">
          <p class="tip">项目编号：</p>
          <p>{{reportState.form.projectId}}</p>
        </div>
        <div class="item">
          <p class="tip">报价链接：</p>
          <p>{{reportState.form.bidUrl}}</p>
        </div>
      </li>

      <li>
        <div class="item">
          <p>备注：</p>
          <p>{{reportState.form.remark}}</p>
        </div>
        <div class="item"></div>
      </li>
    </ul>
    <template>
      <div class="productList" v-if="reportState.form.goodNum > 0">
        <div class="list-title">
          共报备
          <span>{{reportState.form.goodSkuNum}}</span> 条商品，合计
          <span>{{parseFloat(reportState.form.goodTotalPrice)}}</span> 元
        </div>
      </div>
    </template>

    <biding-goods-table hide-edit :tableData="reportState.form.filingBidGoodsList"></biding-goods-table>
  </div>
</template>

<script>
import BidingGoodsTable from '@/components/public/BidingGoodsTable'
import { filingInfoAdd } from '@/api/bid'

import { useReport } from '@/hooks/report'
import { getCurrentInstance, watchEffect } from '@vue/composition-api'
import { useProjectCustomerSetting } from '@/hooks/project'

export default {
  name: 'ConfirmSubmit',
  // import引入的组件需要注入到对象中才能使用
  components: { BidingGoodsTable },
  setup () {
    const vm = getCurrentInstance()
    const submitForm = async () => {
      const loading = vm.$loading()
      await filingInfoAdd(reportState.form)
      reportReset()
      vm.$router.replace('/customer/bidding')
      vm.$alert('您可在 "我的报备 - 竞价报备" 中查看报备记录及状态', '提交报备成功', {
        confirmButtonText: '确定',
        type: 'success',
      })
      loading.close()
    }
    const { reportState, reportReset } = useReport(submitForm)

    const { state: projectState } = useProjectCustomerSetting()

    watchEffect(() => {
      reportState.form.bidPlatformId = projectState.projectId
      reportState.form.bidPlatformName = projectState.projectName
    })

    return {
      reportState,
    }
  },
  data () {
    // 这里存放数据
    return {
      tableObj: {
        isOperate: false,
        tableData: [],
        pageSize: 10,
        pageNum: 1,
        total: 0,
        isShowPages: false,
        list: [],
      },
    }
  },
  mounted () {

  },
  // 方法集合
  methods: {

    // 时间戳转为日期格式 yyyy-mm-dd
    getMyDate (str) {
      var oDate = new Date(str)
      var oYear = oDate.getFullYear()
      var oMonth = oDate.getMonth() + 1
      var oDay = oDate.getDate()
      var oHour = oDate.getHours()
      var oMin = oDate.getMinutes()
      var oSen = oDate.getSeconds()
      var oTime = null
      if (this.$store.state.infoStr == 'stepPrice') {
        oTime =
          oYear +
          '-' +
          this.addZero(oMonth) +
          '-' +
          this.addZero(oDay) +
          ' ' +
          this.addZero(oHour) +
          ':' +
          this.addZero(oMin) +
          ':' +
          this.addZero(oSen)
      } else {
        oTime = oYear + '-' + this.addZero(oMonth) + '-' + this.addZero(oDay)
      }
      return oTime
    },
    // 日期补 0 操作
    addZero (num) {
      if (parseInt(num) < 10) {
        num = '0' + num
      }
      return num
    },
    // 修改分页数量大小
    sizeChange (val) {
      this.tableObj.pageSize = val
      this.getFilingProInfo(this.$store.state.filiId)
    },
    // 修改页码
    numChange (val) {
      this.tableObj.pageNum = val
      this.getFilingProInfo(this.$store.state.filiId)
    },
  },
}
</script>
<style lang='less' scoped>
//@import url(); 引入公共css类
.submitBox {
  .personInfo {
    width: 80%;
    margin: 5px auto;
    li {
      display: flex;
      align-items: center;
      .item {
        flex: 1;
        display: flex;
        margin-bottom: 10px;
        font-size: 14px;
        .tip {
          &:before {
            // display: block;
            content: '*';
            color: #e51c23;
          }
        }
      }
      .item:last-child {
        margin-left: 60px;
      }
    }
  }
  .productList {
    margin-top: 10px;
    .list-title {
      font-size: 14px;
      font-weight: bold;
      padding-left: 10px;
      margin-bottom: 35px;
      span {
        color: #e51c23;
      }
    }
  }
}
</style>
